import React from 'react'
import { useNavigate } from 'react-router-dom'
import { Toast, NavBar } from 'react-vant';
import { Tabs } from 'react-vant'
import './index.css'
import { Empty } from 'react-vant';
function index() {
  const navigate = useNavigate()

  const geTail = () => {
     navigate('/home/shop')
  }

  return (
    <div>
      <NavBar
        title="我的订单"
        leftText="返回"
        rightText="按钮"
        onClickLeft={() => navigate(-1)}
        onClickRight={() => Toast('按钮')}
      />


      <div className="danbox">
        <Tabs>
          {['我的挂号', '咨询订单', '商城订单', '专科服务', '处方配送', '体验订单', '就诊卡充值', '门诊缴费', '住院缴费', '医护上门', '健康课堂', '贴心就诊', '私人医生', '日间手术'].map(item => (
            <Tabs.TabPane key={item} title={`${item}`}>
              内容 {item}
            </Tabs.TabPane>
          ))}
        </Tabs>
      </div>
      <div className='danbox1'>
        <Empty
          className="custom-image"
          imageSize={90}
          image={<img src="https://img.yzcdn.cn/vant/custom-empty-image.png" />}
          description="您还没有下过单, 去看看需要什么"
        />
        <button className='btndan' onClick={geTail}>去看看</button>
      </div>
    </div>
  )
}

export default index